<%@ page language="java" contentType="text/html; charset=UTF-8"
		 pageEncoding="UTF-8" %>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="description" content="" />
		<meta name="keywords" content="" />
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<!-- 禁用电话号码检测功能，禁止对数字随便可以拨号 -->
		<meta name="format-detection" content="telephone=no">
		<!-- 禁用地址检测功能，禁止跳转到地图 -->
		<meta name="format-detection" content="address=no">
		<!-- 在苹果设备上以全屏方式打开本网页 -->
		<meta name="apple-mobile-web-app-capable" content="yes">
		<!-- 设置在苹果设备上状态的颜色，默认白色，要设置成什么颜色以Web颜色的风格而定 -->
		<meta name="apple-mobile-web-app-status-bar-style" content="white">
		<title>微信商城-结算</title>
		<link rel="stylesheet" type="text/css" href="vendor/normalize.min.css"/>
		<!-- 可选 -->
		<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css" />
		<!-- 可选 -->
		<link rel="stylesheet" type="text/css" href="vendor/bootstrap.min.css"/>
		<link rel="stylesheet" href="vendor/swiper/swiper.min.css" />
		<link rel="stylesheet" href="css/common.css" />
		<link rel="stylesheet" href="css/orderlist.css" />
		<!-- 苹果设备在桌面上生成的快捷图标 -->
		<link rel="apple-touch-icon" href="img/apple-touch-icon.png">
		<link rel="icon" href="img/favicon.ico">
	</head>
	
	<body>
		<header class="header-wrapper">
			<ul class="header-list">
				<li>
					<a href="index.jsp">
						<i class="fa fa-2x fa-home"></i>
						<p>首页</p>
					</a>
				</li>
				<li>
					<a href="productlist.html">
						<i class="fa fa-2x fa-th"></i>
						<p>商品分类</p>
					</a>
				</li>
				<li>
					<a href="shopcar.jsp">
						<i class="fa fa-2x fa-shopping-cart"></i>
						<p>购物车</p>
					</a>
				</li>
				<li>
					<a href="userinfo.jsp">
						<i class="fa fa-2x fa-user"></i>
						<p>用户中心</p>
					</a>
				</li>
			</ul>
		</header>
		<section style="width: 100%; height: .6rem;"></section>
		
		<section class="orderlist-main">
			<div class="main-goods">
				<h3>收货人地址</h3>
				<div class="goods-form">
					<form action="">
					    <input type="radio" value="address2" name="address" id="address2" class="address" style="cursor: pointer;" checked="checked"/>&nbsp;<label for="address2" class="form-label">上海市 虹口区 临潼路255号上海兴安得力软件有限公司</label>
					    <p><span>姓名：</span>章某某某  &nbsp;&nbsp;<span>手机号码:</span>13566666666</p>
					    <div class="form-solid"></div>
					    <input type="radio" value="address3" name="address" id="new-address" style="cursor: pointer;"/>&nbsp;<label for="new-address" class="form-label">使用新的收货地址</label>
					    <div class="form-new-address">
					    	<div class="address-inner">
					    		<span>收货人姓名:</span><br />
					    		<input type="text" class="input"/>
					    		<span>所在地区：</span><br />
					    		<select name="privence" style="width: 1.3rem;height: .4rem;">
					    			<option value="">--请选择所在省市--</option>
					    			<option value="">北京市</option>
					    			<option value="">上海市</option>
					    			<option value="">重庆市</option>
					    		</select>&nbsp;&nbsp;
					    		<select name="city" style="width: 1.3rem;height: .4rem;">
					    			<option value="privence">--请选择所在城市--</option>
					    			<option value="">长沙</option>
					    			<option value="">武汉</option>
					    			<option value="">昆明</option>
					    		</select>&nbsp;&nbsp;
					    		<select name="area" style="width: 1.3rem;height: .4rem;">
					    			<option value="privence">--请选择所在地区--</option>
					    			<option value="">沙坪坝区</option>
					    			<option value="">呈贡区</option>
					    			<option value="">五华区</option>
					    		</select><br />
					    		<span>详细地址:</span><br />
					    		<input type="text" class="input"/><br />
					    		<span>手机号码:</span><br />
					    		<input type="text" class="input"/><br />
					    		<input type="checkbox" id="address" checked="checked"/>&nbsp;<label for="address" class="text">自动保存收货地址（选择后该地址将会保存到你的收货地址列表）</label>
					    	</div>
					    </div>
					</form>
				</div>
			</div>
			<div class="main-goods">
				<h3>发票信息</h3>
				<div class="goods-form">
					<form action="">
		    			<input type="checkbox" id="invoice"/>&nbsp;<label for="invoice" class="text1">是否开发票</label>
		    			<div class="form-invoice">
		    				<div class="invoice-inner">
		    					<span>发票抬头：</span><br />
		    					<select name="" class="inner-title">
		    						<option value="">个人</option>
		    						<option value="">单位</option>
		    					</select>
		    					<input type="text"/>
		    				</div>
		    			</div>
					</form>
				</div>
			</div>
			
			<div class="main-goods-list">
				<h3>商品清单</h3>
				<table class="table table-bordered">
					<tr>
						<th>商品名称</th>
						<th>数量</th>
						<th>小计</th>
					</tr>
					<tr>
						<td>冬季外套</td>
						<td>2</td>
						<td>235</td>
					</tr>
					<tr>
						<td>冬季外套</td>
						<td>2</td>
						<td>235</td>
					</tr>
					<tr>
						<td>冬季外套</td>
						<td>2</td>
						<td>235</td>
					</tr>
				</table>
			</div>
			
			<div class="main-message">
				<h3>给卖家留言</h3>
				<input type="text" id="message-input"/>
			</div>
		</section>
        
       <section style="width: 100%;height: .5rem;"></section>
        <footer class="orderlist-footer">
        	<div class="footer-left">
        		<span class="left-price">总价： <span>￥79743</span></span>
        	</div>
        	<div class="footer-right">
        		<a href="">提交订单</a>
        	</div>
        </footer>

		<script src="js/resize.js"></script>
		<script src="vendor/jquery.min.js"></script>
		<script>
			$(function() {
				$('#new-address').click(function() {
					$('.form-new-address').show();
				});
				
				$('#invoice').click(function() {
					$('.form-invoice').show();
				})
			})
		</script>
	</body>
</html>
